<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>好好吃商城</title>
    <link type="text/css" href="css/css.css" rel="stylesheet"/>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/js.js"></script>
    <script src="js/wb.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
<div class="mianCont" id="app">
    <div class="top">
        <span>您好！欢迎来到好好吃商城</span>
        <span class="topRight">
    <a href="index.html">好好吃</a>&nbsp;|
    <a href="order.html">我的订单</a>&nbsp;| 
    <a href="vip.html">会员中心</a>&nbsp;|
    <a href="#">联系我们</a>
   </span>
    </div><!--top/-->
    <div class="lsg">s
        <h1 class="logo"><a href="index.html"><img src="img/logo.png" width="217" height="90"/></a></h1>
        <form action="#" method="get" class="subBox">
            <div class="subBoxDiv">
                <input type="text" class="subLeft" id="sub"/>
                <input type="image" id="sublert2" src="img/subimg.png" width="63" height="34" class="sub"/>
                <div class="hotWord">
                    热门搜索：
                    <a href="#">辣条</a>&nbsp;
                    <a href="#">大礼包</a> &nbsp;
                    <a href="#">手撕面包</a>&nbsp;
                    <a href="#">鸭脖</a> &nbsp;
                    <a href="#">每日坚果</a> &nbsp;
                    <a href="#">芒果干</a>&nbsp;
                </div><!--hotWord/-->
            </div><!--subBoxDiv/-->
        </form><!--subBox/-->

    </div><!--lsg/-->
    <div class="pnt">
        <div class="pntLeft">
            <h2 class="Title">所有商品分类
                <ul class="InPorNav">
                    <li><a href="product.html">镇店爆款</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='镇店爆款'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div>
                    </li>
                    <li><a href="product.html">量贩专区</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='量贩专区'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">坚果炒货</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='坚果炒货'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">肉类卤味</a>
                        <div class="chilInPorNav" id="roulei">
                            <a href="#" v-for="item in goods" v-if="item.type=='肉类卤味'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">干果蜜钳</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='干果蜜钳'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">糕点点心</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='糕点点心'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">方便素食</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='方便素食'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.html">冲饮茶饮</a>
                        <div class="chilInPorNav">
                            <a href="#" v-for="item in goods" v-if="item.type=='冲茶茶饮'" @click="gooou(item.id)">{{item.goodsName}}</a>
                        </div><!--chilLeftNav/-->
                    </li>
                </ul><!--InPorNav/-->
            </h2>
        </div><!--pntLeft/-->
        <div class="pntRight">
            <ul class="nav">
                <li><a href="index.html">商城首页</a></li>
                <li><a href="product.html">促销中心</a></li>
                <li><a href="vip.html">会员中心</a></li>
                <li class="navCur"><a href="help.html">帮助中心</a></li>
                <div class="clears"></div>
                <div class="phone">TEL：021-12345678</div>
            </ul><!--nav/-->
        </div><!--pntRight/-->
        <div class="clears"></div>
    </div><!--pnt/-->
    <div class="positions">
        当前位置：<a href="index.html">首页</a> &gt; <a href="#" class="posCur">填写核对订单</a>
    </div><!--positions/-->
    <div class="cont">
        <div class="carImg"><img src="img/car2.jpg" width="961" height="27"/></div>
        <h4 class="orderTitle">收货地址</h4>
        <table class="ord">
            <tr>
                <td width="20%">
                    <input type="radio" checked/> {{ds.name}}
                </td>
                <td width="20%">
                    {{ds.sex}}
                </td>
                <td width="20%">
                    {{ds.address}}
                </td>
                <td width="20%">
                    {{ds.xh}}
                </td>
            </tr>
        </table><!--ord/-->

        <h4 class="orderTitle">支付方式</h4>
        <ul class="zhiList">


            <li>支付</li>

            <div class="clears"></div>
        </ul><!--zhiList/-->


        <div class="zhifufangshi">
            <ul class="yinhang">

                <li><input type="radio" checked/><img src="img/zhifubao.jpg"/></li>
                <div class="clear"></div>
            </ul>
        </div><!--zhzhifufangshii/-->

        <h4 class="orderTitle">购物清单</h4>
        <table class="orderList">
            <tr>
                <th width="20"></th>
                <th width="430">商品</th>
                <th width="135">单价</th>
                <th width="135">数量</th>
                <th width="135">总金额</th>

            </tr>
            <tr v-for="(item,index) in dod" v-bind:id="'favor'+index">

                <td></td>
                <td>
                    <dl>
                        <dt><a href="#"><img v-bind:src="item.goodsImg" width="85" height="85"/></a></dt>
                        <dd>{{item.goodsName}}<br/><span class="red">{{item.goodsDetails}}</span></dd>
                        <div class="clears"></div>
                    </dl>
                </td>
                <td><strong class="red">¥&nbsp{{item.goodsPrice}}元</strong></td>
                <td>
                    <div class="jia_jian">

                        <input class="shuliang" :value="item.carNum" readonly=“readonly”/>

                    </div>
                </td>
                <td><strong class="red">¥ {{item.goodsPrice*item.carNum}}元</strong></td>

            </tr>

        </table><!--orderList/-->
        <table class="zongjia" align="right">
            <tr>
                <td width="120" align="left">商品总价：</td>
                <td width="60"><strong class="red">+{{tot}}元</strong></td>
            </tr>
            <tr>
                <td width="120" align="left">运费总额：</td>
                <td><strong class="red">+10 元</strong></td>
            </tr>
            <tr>
                <td width="120" align="left">合计：</td>
                <td><strong class="red">+{{tot2}} 元</strong></td>
            </tr>
            <tr>
                <td colspan="2" style="height:50px;">
                    <a href="success.html"><img src="img/tijao.png" @click="submit" width="142" height="32"/></a>
                </td>
            </tr>
        </table><!--zongjia/-->
        <div class="clears"></div>
    </div><!--cont/-->
    <div class="inHelp">
        <div class="inHLeft">
            <h4>帮助中心</h4>
            <ul class="inHeList">
                <li><a href="help.html">购物指南</a></li>
                <li><a href="help.html">支付方式</a></li>
                <li><a href="help.html">售后服务</a></li>
                <li><a href="help.html">企业简介</a></li>
                <div class="clears"></div>
            </ul><!--inHeList/-->
        </div><!--inHLeft/-->
        <div class="inHLeft">
            <h4>会员服务</h4>
            <ul class="inHeList">
                <li><a href="reg.html">会员注册</a></li>
                <li><a href="login.html">会员登录</a></li>
                <li><a href="order.html">购物车</a></li>
                <li><a href="order.html">我的订单</a></li>
                <div class="clears"></div>
            </ul><!--inHeList/-->
        </div><!--inHLeft/-->
        <div class="inHRight">
            <h4>全国统一免费服务热线</h4>
            <div class="telBox">400-0000-0000</div>
            <div class="weibo">

            </div>
        </div><!--inHRight/-->
        <div class="clears"></div>
    </div><!--inHelp/-->
    <div class="footer">
        <p>
            <a href="http://www.schhc.com">好好吃官网</a>&nbsp;|&nbsp;
            <a href="index.html">商城首页</a>&nbsp;|&nbsp;
            <a href="product.html">促销中心</a>&nbsp;|&nbsp;
            <a href="order.html">我的订单</a>&nbsp;|&nbsp;
            <a href="https://news.sina.com.cn">新闻动态</a>&nbsp;|&nbsp;
            <a href="vip.html">会员中心</a>&nbsp;|&nbsp;
            <a href="help.html">帮助中心</a>
        </p>
        <p>
            版权所有：好好吃实业有限公司 版权所有 Copyright 2010-2015 ICP备00000000号
        </p>
    </div><!--footer/-->
</div><!--mianCont/-->
<script type="text/javascript" src="js/config.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript">
    var app = new Vue({
        el: "#app",
        data: {
            goods: [],
            dod: [],
            ds: [],
            account: [],
            account2:[],
            tals: [],
            tot: 0,
            tot2: 0
        },
        methods: {
            gooou(id) {
                $.cookie('name', id, {path: '/proinfo.html'});
                $(window).attr('location', 'proinfo.html');

            },
            submit() {

                var data = {
                    "order": {
                        "orderStatus": 1,
                        "flag": "",
                        "userXh": name,
                        "userId": app.ds.id,
                        "orderAddress": app.ds.address,
                        "orderNumber": app.account.length,
                        "orderMoney": app.tot2
                    },
                    "details": app.tals
                }

                $.ajax({
                    url: config.ORDER_ADDORDER,
                    type: "post",
                    dataType: "json",
                    contentType: 'application/json',
                    data: JSON.stringify(data),
                    success: function (data) {



                    }
                })
                for (i=0;i<app.account.length;i++){//提交订单后删除购物车数据
                    console.log(app.account[i])
                    $.ajax({
                        url: config.CAR_DELETEBYID,
                        type: "post",
                        dataType: "json",
                        data: {
                            "goodsId":app.account[i]
                        },
                        success: function (data) {



                        }
                    })
                }
            }
        }
    })

    $(document).ready(function () {
        app.tot = $.cookie('acc');
        app.tot2 = parseInt(app.tot) + 10//总金额
        var account = $.cookie('accounts');//接收发过来的选择要购买的信息
        app.account = account.split(",")


        $.ajax({
            url: config.GOODS_GETALL,
            type: "post",
            dataType: "json",
            data: {},
            success: function (data) {
                app.goods = data.data

            }
        })


//登陆检查 获取使用者ID
        $.ajax({
            url: config.USER_LOGINCHECK,
            type: "post",
            dataType: "json",
            data: {},
            success: function (data) {
                app.ds = data.data

                console.log(app.ds)
            }

        })
    })
    name = $.cookie('name');
    //购物车查询
    $.ajax({
        url: config.CAR_GETBYXH,
        type: "post",
        dataType: "json",
        data: {
            "userXh": name

        },
        success: function (data) {

            var m = 0

            for (var i = 0; i < app.account.length; i++) {
                for (var j = 0; j < data.data.length; j++) {
                    if (parseInt(app.account[i]) == data.data[j].id) {
                        app.dod[m] = data.data[j]
                        var tal = {
                            "orderId": 0,
                            "userId": 1,
                            "num": 1,
                            "price": 21.00,
                            "goodsId": 2
                        }

                        tal.orderId = 0   //给tal赋值
                        tal.userId = app.dod[m].userId
                        tal.num = data.data[j].carNum
                        tal.price = data.data[j].goodsPrice
                        tal.goodsId = data.data[j].goodsId
                        app.tals[m] = tal

                        m++
                    }

                }

            }
            //app.dod = data.data
            console.log(app.dod)
            console.log(app.tals)
        }

    })

    $('#sublert2').click(function () {//搜索框

//通过ID查询商品
        $.ajax({
            url: config.GOODS_GETALL,
            type: "post",
            dataType: "json",
            data: {
                "value": $("#sub").val()
            },
            success: function (data) {

                if (data.data == "") {
                    alert("没有此商品")
                } else {
                    var id = data.data[0].id;

                    $.cookie('name', id, {path: '/proinfo.html'});
                    $(window).attr('location', 'proinfo.html');
                }
            }
        })
    })


</script>
</body>
</html>
